<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hello Electrobun!</title>
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <div class="container">
        <h1>Hello Electrobun! 🎉</h1>
        <p class="subtitle">A fast, cross-platform desktop app framework</p>
        
        <div class="welcome-section">
            <p>Welcome to your first Electrobun app! This framework combines the power of Bun with native desktop capabilities.</p>
            
            <h2>What is Electrobun?</h2>
            <ul>
                <li><strong>Fast:</strong> Built on Bun's lightning-fast JavaScript runtime</li>
                <li><strong>Native:</strong> Access to system APIs like menus, trays, and file dialogs</li>
                <li><strong>Cross-platform:</strong> Works on macOS, Windows, and Linux</li>
                <li><strong>Web-based UI:</strong> Use familiar HTML, CSS, and JavaScript for your interface</li>
            </ul>
            
            <h2>Get Started</h2>
            <p>Ready to build something amazing? Check out the documentation and examples:</p>
            
            <div class="links">
                <a href="https://electrobun.dev/" class="doc-link">
                    📚 Electrobun
                </a>
                <a href="https://github.com/blackboardsh/electrobun" class="doc-link">
                    🐙 GitHub Repository
                </a>
                <a href="https://electrobun.dev/docs/apis/bun/" class="doc-link">
                    💡 Api Docs
                </a>
            </div>
        </div>

        <div class="footer">
            <p>Edit <code>src/bun/index.ts</code> and <code>src/mainview/</code> to customize your app</p>
        </div>
    </div>
</body>
</html>